<template>
  <svg :width="config.ref.width" :height="config.ref.height">
    <component v-for="(item,k) in config.element" :key="'element_'+k" :index="k" :is="item.tag+'Svg'" :refConfig="config.ref" :config="item" :transform="transform"></component>
  </svg>
</template>

<script>
import circleSvg from "./circleSvg";
import semiCircleSvg from "./semiCircleSvg";
import rectSvg from "./rectSvg";
export default {
  name: "starSvg",
  components:{
    circleSvg,
    semiCircleSvg,
    rectSvg
  },
  props:{
    motion:{
      default:()=> {
        return null
      }
    },
    transform:{
      default:()=> {
        return 'scale(1,1)'
      }
    },
    config:{
      default:()=>{
        return {
          ref:{
            name:'',
            x:0,
            y:0,
            width:200,
            height:300,
            fillMode:null,
            fillColor:[]
          },
          element:[
            {
              tag:'',
              x:0,
              y:0,
              width:0,
              height:0,
              stoke:'',
              border:0,
              fill:''
            }
          ]
        }
      }
    }
  }
}
</script>

<style scoped>

</style>